<template>
  <div>
    <el-table :data="tableDataA" stripe style="width: 100%">
      <el-table-column align="center" prop="interval" label="时间">
      </el-table-column>
      <el-table-column align="center" prop="period" label="时段">
        <template v-slot="{row}">
          <el-tag type="success" :style="{'background-color':row.col,'color':'#fff'}">{{ row.period }}</el-tag>
        </template>
      </el-table-column>
      <el-table-column align="center" prop="electricityPrice" label="电费(元)">
      </el-table-column>
      <el-table-column align="center" prop="serviceCharge" label="服务费(元)">
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
  import { getInfoByStationApi} from '@/api/smart/operator/adjustPrice.js'
export default {
  name: "StationPrice",
  data(){
    return{
      // 场站电区间价设置表格数据
      tableDataA: [],
    }
  },
  props: {
    station: {
      type: Object,
      default: function () {
        return {}
      }
    },
  },
  watch: {
    station: {
      handler() {
        this.getList();
      },
      deep: true
    }
  },
  methods:{
    /** 查询场站电区间价设置列表 */
    getList() {
      let params = {
        priceTypeId: this.station.priceTypeId
      }
      getInfoByStationApi(params).then(res => {
        this.tableDataA = res.data.tableDataList || []
      })
    },
  }
}
</script>
